{include file='common/_meta' /}
<style>
.layui-table-cell .classbtn,.layui-table-tips-main .classbtn{
    display: inline-block;
    background: #fff;
    height: 25px;
    line-height: 25px;
    padding: 0 5px;
    border-radius: 5px;
    border:1px solid #ccc;
    cursor:pointer
}
.layui-card-header > span {
    font-weight: bold;
    font-size: 18px;
    color: #0C0C0C;
}

.open-new {
    font-size: 14px;
    border-bottom: #dedede solid 1px;
    margin-left: 80px;
}
.layui-table .openTable-open-td{
    border-bottom: 2px solid #ccc;
}
.openTable-open-td .openTable-open-item-div{
margin-top: 2px;
margin-bottom: 5px;
margin-right: 10px;
font-size: 14px;
}

</style>
<body>
<div class="container">
	<div class="layui-row">
        <div class="layui-col-md12 breadcrumb">
    		<span class="layui-breadcrumb">
    			<a><cite>用户管理</cite></a>
    			<a><cite>用户列表</cite></a>
    		</span>
        </div>
    </div>

    <div class="layui-row">

    	<form class="layui-form" action="" lay-filter="" style="padding-top: 15px;">

    		<div class="layui-col-sm4">
				<div class="layui-form-item">
				    <label class="layui-form-label">用户：</label>
				    <div class="layui-input-block">
			     	 	<select name="cid" lay-search>
			     	 		<option value="">全部</option>
			     	 		{volist name='chas' id='v'}
			     	 		<option value="{$v.channel_id}">{$v.company_name}({$v.channel_id})</option>
			     	 		{/volist}
				      	</select>
				    </div>
			  	</div>
    		</div>

    		<div class="layui-col-sm4">
				<div class="layui-input-block">
			      	<button class="layui-btn custom-sm-fluid" lay-submit lay-filter="custom-search">搜索</button>
			    </div>
    		</div>

    	</form>

    </div>

	<div class="layui-col-md12">

		<table class="layui-hide" id="initdate" lay-filter="datatable"></table>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">

            	{if condition="session('user_type') eq 'admin'"}
                	<button class="layui-btn layui-btn-sm" lay-event="add">添加用户</button>
                {/if}

                {if condition="is_OneCha()"}
                	<button class="layui-btn layui-btn-sm" lay-event="add-son">添加子用户</button>
                {/if}

            </div>
        </script>

        <script type="text/html" id="barDemo">

        	{{#  if (d.status == '1') {  }}

            <a class="classbtn stop" style="color:red" lay-event="stop" title="禁用"><i class="layui-icon layui-icon-pause"></i></a>

			{{#  } else if (d.status == '0') {  }}

			<a class="classbtn start" style="color:green" lay-event="start" title="启用"><i class="layui-icon layui-icon-play"></i></a>

            {{#  }  }}

          	<a class="classbtn" lay-event="edit" title="查看信息/编辑"><i class="layui-icon layui-icon-form"></i></a>
            {{#  if (d.onoff_) {  }}

			<a class="classbtn" lay-event="query" title="刷新CMPP状态"><i class="layui-icon layui-icon-refresh"></i></a>

            {{#  }  }}
            <a class="classbtn" style="color:red" lay-event="delete1" title="删除"><i class="layui-icon layui-icon-delete"></i></a>

        </script>

	</div>

</div>
{include file="common/_footer"}

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript">
var tableIns;
layui.config({
    //配置 layui 第三方扩展组件存放的基础目录
    base: '/static/layui_exts/'
}).extend({
    openTable: 'openTable/openTable'
}).use(['table', 'form', 'layer','openTable'], function() {

	var table = layui.table;
	var layer = layui.layer;
    var form  = layui.form;
	var openTable  = layui.openTable;

    tableIns = openTable.render({
        elem: '#initdate'
        ,id: '#initdate'
        ,url:'{:url('Channel/index')}'
        ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
        ,toolbar: '#toolbarDemo'//默认工具栏
        ,defaultToolbar: []
        ,method:'get'//请求方式
        ,where: {api: 1}
        ,page:true//开启分页
        ,limit:15//每页记录数
        ,limits: [15,20,30,40,50,60,70,80,90]
        ,cols: [[
            {field:'company_name', title: '公司ID/名称', minWidth: 130}
            ,{field:'channel_type', title: '对接类型', align: 'center', minWidth: 90}
            ,{field:'status_', title: '账号状态', align: 'center', minWidth: 90}
            ,{field:'currency', title: '币种', align: 'center', minWidth: 90}

            ,{title: '操作', toolbar: '#barDemo', width: 130, unresize: true}
        ]]
        //注：展开的列Items
        , openCols: [
            {field:'user_name', title: '公司联系人/电话', minWidth: 80}
            
            {if condition="(session('channel_level') == '1') "}
            ,{field:'cid_key', title: '接口秘钥'}
            {/if}
            ,{field:'back_url', title: '回调地址'}
            ,{field:'src_id', title: '接入码', minWidth: 120}
            ,{field:'range_size', title: '扩展位数'}
            ,{field:'create_time', title: '创建时间', minWidth: 175}
        ]
    });

    //监听头工具栏事件
    table.on('toolbar(datatable)', function(obj) {

        switch(obj.event) {

            case 'add':
                layer.open({
                    type: 2,
                    title: '添加用户',
                    area: ['100%', '100%'],
                    content: '{:url('Channel/add')}'
                });
                break;

            case 'add-son':
                layer.open({
                    type: 2,
                    title: '添加子用户',
                    area: ['100%', '100%'],
                    content: '{:url('Channel/addChild')}'
                });
                break;
        };
    });

    //监听工具条
  	table.on('tool(datatable)', function(obj) {

        var data = obj.data;

        switch(obj.event) {

            case 'edit':
                layer.open({
                    type: 2,
                    title: '编辑用户',
                    area: ['100%', '100%'],
                    content: '{:url('Channel/edt')}' + '?id=' + data.channel_id
                });
                break;
            case 'delete1':
                layer.confirm('确认要删除吗？',function(index) {
                    layer.close(index);
                    layer.confirm('确认是真的要删除吗？',function(index) {
                        layer.close(index);
                        
                        
                        $.post('{:url('Channel/DeleteChannel')}',{'channel_id':data.channel_id},function(data) {
                            if(data.code == 200){
                                table.reload("#initdate",{});
                                layer.msg('已删除!',{icon: 5,time:1000});
                            }else{
                                layer.msg('删除失败!',{icon: 5,time:2000});
                            }
                        });
                    })
                })
                break;
            case 'cmpp':
                layer.open({
                    type: 2,
                    title: '编辑用户',
                    area: ['100%', '100%'],
                    content: '{:url('Channel/edt')}' + '?id=' + data.channel_id
                });
                break;

            case 'stop':

              	layer.confirm('确认要禁用吗？',function(index) {
              	    //此处请求后台程序，下方是成功后的前台处理……
              	    $.post('{:url('Channel/openClose')}',{'channel_id':data.channel_id,'status':'0'},function(data) {
              	        if(data == '1'){

              	            obj.tr.find('.stop').after('<a class="layui-btn-xs start" style="color:green" lay-event="start" title="启用"><i class="layui-icon layui-icon-play"></i></a>');
                            obj.tr.find('.stop').remove();

                            obj.tr.find('.status-qy').after('<span class="layui-badge status-jy">禁用</span>');
                            obj.tr.find('.status-qy').remove();

              	            layer.msg('已禁用!',{icon: 5,time:1000});
              	        }else{
              	            layer.msg('禁用失败!',{icon: 5,time:2000});
              	        }
              	    });
              	});

                break;

            case 'start':

	            layer.confirm('确认要启用吗？',function(index) {
	                //此处请求后台程序，下方是成功后的前台处理……
	                $.post('{:url('Channel/openClose')}',{'channel_id':data.channel_id,'status':'1'},function(data){
	                    if(data == '1'){

	                        obj.tr.find('.start').after('<a class="layui-btn-xs stop" style="color:red" lay-event="stop" title="禁用"><i class="layui-icon layui-icon-pause"></i></a>');
                            obj.tr.find('.start').remove();

                            obj.tr.find('.status-jy').after('<span class="layui-badge layui-bg-green status-qy">启用</span>');
                            obj.tr.find('.status-jy').remove();

	                        layer.msg('已开启!', {icon: 6,time:1000});
	                    }else{
	                        layer.msg('开启失败!',{icon: 5,time:2000});
	                    }
	                });
	            });

                break;

            case 'query':

                    layer.confirm('查询', function(index) {

                    	$.post("{:url('Channel/query_service')}", {'channelid':data.channel_id}, function(data) {

                    	    if(data.code == 1) {

                    	        if (data.status === 1) {

                    	            obj.tr.find('.status-txz').after('<span class="layui-badge layui-bg-green status-wlj">通讯中</span>');
                    	        } else if (data.status === 0) {

                    	            obj.tr.find('.status-wlj').after('<span class="layui-badge status-txz">未连接</span>');
                    	        } else {

                    	            $(obj).parents("tr").find(".onoff").html('');
                    	        }
                    	    } else {

                    	        layer.msg('请求失败，请重试!',{icon: 5, time: 2000});
                    	    }
                    	});

                  	});

                    break;

        };

    });

  	// 监听搜索事件
    form.on('submit(custom-search)', function(data) {

      	table.reload("#initdate",{
        	where: {cid: data.field.cid ,api: 1 }
        	,page: {curr: 1 }
      	});
        // table.reload("#initdate", {where: {text: "测试搜索条件"}});

        $(window).resize()

      	return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });

    /*解决操作按钮收缩，打开tips框不生效问题 start*/
    $(document).off('mousedown', '.layui-table-grid-down').on('mousedown', '.layui-table-grid-down', function (even) {

		table._tableTrCurr = $(this).closest('td');
    });

    $(document).off('click', '.layui-table-tips-main [lay-event]').on('click', '.layui-table-tips-main [lay-event]', function (even) {

		var elem = $(this);
		var tableTrCurr = table._tableTrCurr;

		if (!tableTrCurr) {

			return;
		}

		var layerIndex = elem.closest('.layui-table-tips').attr('times');
		layer.close(layerIndex);

		table._tableTrCurr.find('[lay-event="' + elem.attr('lay-event') + '"]').first().click();
    });
    /*解决操作按钮收缩，打开tips框不生效问题 end*/

});
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
